<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>Activities</title>
		<script src="/js/vue.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="/js/axios.min.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css"/>
		<link rel="stylesheet" href="css/index.css">
		<script src="/js/jquery.min.js"></script>
		<script src="/js/jquery.i18n.properties.min.js"></script>
		<script src="/js/util.js"></script>
		<style type="text/css">
			.select-box{
				padding: 0.625rem;
				display: none;
				background-color: #007AFF;
				z-index: 100;
				position: absolute;
				right: 0rem;
				top: 0rem;
			}
			.select-box .language{
				margin-bottom: 0.3125rem;
			}
			.title{
				text-align: center;
				margin-bottom: 20px;
			}
			.mainbody img{
				max-width: 100%;
			}
			.eventTime{
				text-align: center;
			}
		</style>
	</head>
	<body>
	<div class="container-fluid topbg">
		<div style="display: flex;justify-content: flex-start;float: left;margin-left: 8px">
			<img src="img/fanhui.png" style="width: 20px;height: 20px" onclick="fanhui()">
		</div>
		<div class="flex pull-right">
			<div class="language">
				<img src="img/yingguo.png" class="guoqi" >
				<span>ENG</span>
			</div>
			<div>
				<a href="login.html" class="loginBtn" data-lang="login">登录</a>
			</div>
			<div class="select-box">
				<div class="language">
					<img src="img/zhongguo.png" class="guoqi" >
					<span>中文</span>
				</div>
				<div class="language">
					<img src="img/yingguo.png" class="guoqi" >
					<span>EN</span>
				</div>
				<div class="language">
					<img src="img/taiguo.png" class="guoqi" >
					<span>ภาษาไทย</span>
				</div>
				<div class="language">
					<img src="img/jianpuzhai.webp" class="guoqi" >
					<span>កម្ពុជា។</span>
				</div>
			</div>
		</div>
	</div>
	<div class="container">
		<h3 class="title"></h3>
		<h4 class="eventTime"></h4>
		<div class="mainbody"></div>
	</div>
	</body>
	<script type="text/javascript">

		function fanhui(){
			window.history.go(-1); //返回上一页
		}
		// 加载活动详情
		$(function () {
			let yuyan =localStorage.getItem("yuyan");
			let width = $(window).width();
			if(width>1000) {
				$(".container").width('600px');
				$(".topbg").width('600px');
			}
			let id = getQuery('id');
			let host = getRootPath();
			$.ajax({
				url:`${host}/activities/getActivitiesByIdUser`,
				data:{"id":id,"yuyan":yuyan},
				success:function (res) {
					if(res.code==200){
						$(".title").html(res.data.title);
						var str = "เวลากิจกรรม";
						if (yuyan=="zh"){
							str = "活动时间";
						}else if (yuyan=="en"){
							str = "Activity time";
						}
						$(".eventTime").html(str +"："+res.data.date1+"--"+res.data.date2);
						document.title = res.data.title;
						var reg = /\"\/upload/g;
						let s= res.data.detail.replace(reg,'"'+host+"/upload")
						$(".mainbody").html(s);
					}
				}
			})
		})
		// 切换语言
		$(function () {
			var n = 0;
			if(localStorage.getItem("yuyan")=='zh')
			{
				n=0;// 中文
				$(".topbg>.flex>.language>img").attr('src','img/zhongguo.png');
				$(".topbg>.flex>.language>span").html('中文');
			}
			else if(localStorage.getItem("yuyan")=='en')
			{
				n=1;// 英文
				$(".topbg>.flex>.language>img").attr('src','img/yingguo.png');
				$(".topbg>.flex>.language>span").html('EN');
			}
			else if(localStorage.getItem("yuyan")=='th')
			{
				n=2;// 泰语
				$(".topbg>.flex>.language>img").attr('src','img/taiguo.png');
				$(".topbg>.flex>.language>span").html('ภาษาไทย');
			}
			else if(localStorage.getItem("yuyan")=='kh')
			{
				n=3;
				$(".topbg>.flex>.language>img").attr('src','img/jianpuzhai.webp');
				$(".topbg>.flex>.language>span").html('កម្ពុជា។');
			}
			language_pack.loadProperties(n);
			// 切换语言
			$(".topbg>.flex>.language").click(function(){
				$(".select-box").show();
				$(".select-box>.language").click(function(){
					let n = $(this).index();
					if(n==0)
						localStorage.setItem("yuyan",'zh');// 中文
					else if(n==1)
						localStorage.setItem("yuyan",'en');// 英文
					else if(n==2)
						localStorage.setItem("yuyan",'th');// 泰语
					else if (n==3)
						localStorage.setItem("yuyan",'kh');
					$(".topbg>.flex>.language>img").attr('src',$(this).find('img').attr('src'));
					$(".topbg>.flex>.language>span").html($(this).find('span').html());
					language_pack.loadProperties(n);
					window.history.go(0);
					$('.select-box').hide();
				})
			})
		})
	</script>
</html>
